import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:provider/provider.dart';
import 'package:shop/router/router.dart';
import 'package:shop/util/cart.dart';
import 'package:shop/util/color.dart';

class CartPage extends StatefulWidget {
  const CartPage({super.key});

  @override
  State<CartPage> createState() => CartPageState();
}

class CartPageState extends State<CartPage> {
  final shopCart = ShopCart();

  @override
  void initState() {
    super.initState();

    getShopCart();
  }

  void getShopCart() {
    shopCart.getCarts();
  }

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<ShopCart>.value(
      value: shopCart,
      child: Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(
          iconTheme: IconThemeData(color: Colors.white),
          title: Text('购物车', style: TextStyle(color: Colors.white)),
          backgroundColor: HexColor.fromHex('#C00000'),
        ),
        body: Consumer<ShopCart>(builder: (context, value, child) {
          return Stack(children: [
            Visibility(
              visible: !shopCart.isShow,
              child: Center(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.asset(
                        width: 130,
                        height: 130,
                        'assets/images/cart_empty.png'),
                    SizedBox(
                      height: 10,
                    ),
                    Text('空空如也'),
                  ],
                ),
              ),
            ),
            Column(
              children: [
                Visibility(
                  visible: shopCart.isShow,
                  child: Column(
                    children: [
                      SizedBox(
                        height: 80,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [Text('➕'), Text('请选择收货地址')],
                        ),
                      ),
                      Image.asset('assets/images/cart_border.png'),
                      Container(
                        decoration: BoxDecoration(
                            border: Border(
                                bottom: BorderSide(
                                    color: HexColor.fromHex('#c0c0c0')))),
                        height: 50,
                        child: Row(
                          children: [
                            SizedBox(width: 10),
                            Icon(Icons.store),
                            Text('店铺名字')
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
                Expanded(
                  child: Visibility(
                    visible: shopCart.isShow,
                    child: Column(
                      children: [
                        Expanded(
                          child: ListView.separated(
                            keyboardDismissBehavior:
                                ScrollViewKeyboardDismissBehavior.onDrag,
                            padding: EdgeInsets.all(0),
                            itemCount: shopCart.carts.length,
                            itemBuilder: (BuildContext context, int index) {
                              final goodInfo = shopCart.carts[index];
                              return Dismissible(
                                key: ValueKey(goodInfo.goodsId),
                                direction: DismissDirection.endToStart,
                                background: Row(children: [
                                  Spacer(),
                                  Icon(
                                    Icons.delete,
                                    color: Colors.red,
                                  ),
                                  SizedBox(
                                    width: 30,
                                  )
                                ]),
                                child: Container(
                                  height: 120,
                                  padding: EdgeInsets.all(10),
                                  child: Row(
                                    children: [
                                      InkWell(
                                        child: IconButton(
                                            onPressed: () {
                                              goodInfo.checked =
                                                  !goodInfo.checked;
                                              shopCart.refreshView();
                                            },
                                            icon: Icon(goodInfo.checked
                                                ? Icons.check_circle_outline
                                                : Icons.circle_outlined)),
                                        onTap: () {
                                          goodInfo.checked = !goodInfo.checked;
                                          shopCart.refreshView();
                                        },
                                      ),
                                      InkWell(
                                        child: CachedNetworkImage(
                                          width: 100,
                                          imageUrl: goodInfo.goodsSmallLogo,
                                          fit: BoxFit.cover,
                                          errorWidget: (context, url, error) =>
                                              Icon(Icons.error),
                                        ),
                                        onTap: () {
                                          Navigator.pushNamed(
                                              context, detailPage,
                                              arguments: '${goodInfo.goodsId}');
                                        },
                                      ),
                                      SizedBox(
                                        width: 15,
                                      ),
                                      Expanded(
                                          child: Column(
                                        crossAxisAlignment:
                                            CrossAxisAlignment.start,
                                        children: [
                                          Text(
                                            goodInfo.goodsName,
                                            maxLines: 3,
                                            overflow: TextOverflow.ellipsis,
                                          ),
                                          Spacer(),
                                          Row(
                                            children: [
                                              Text(
                                                '¥${goodInfo.goodsPrice}',
                                                textAlign: TextAlign.left,
                                                style: TextStyle(
                                                    color: HexColor.fromHex(
                                                        '#C00000'),
                                                    fontSize: 18),
                                              ),
                                              Spacer(),
                                              InkWell(
                                                child: Container(
                                                  alignment: Alignment.center,
                                                  decoration: BoxDecoration(
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            5),
                                                    color: HexColor.fromHex(
                                                        '##f8f8f8'),
                                                  ),
                                                  width: 30,
                                                  height: 28,
                                                  child: Text(
                                                    '-',
                                                    style: TextStyle(
                                                        fontSize: 13,
                                                        fontWeight:
                                                            FontWeight.bold),
                                                    textAlign: TextAlign.center,
                                                  ),
                                                ),
                                                onTap: () {
                                                  if (goodInfo.count > 1) {
                                                    goodInfo.count--;
                                                    shopCart.refreshView();
                                                  } else {
                                                    Fluttertoast.showToast(
                                                        msg: '不能再少了',
                                                        toastLength:
                                                            Toast.LENGTH_SHORT,
                                                        gravity:
                                                            ToastGravity.CENTER,
                                                        timeInSecForIosWeb: 1,
                                                        backgroundColor:
                                                            Colors.red,
                                                        textColor: Colors.white,
                                                        fontSize: 16.0);
                                                  }
                                                },
                                              ),
                                              SizedBox(
                                                width: 3,
                                              ),
                                              Container(
                                                alignment: Alignment.center,
                                                decoration: BoxDecoration(
                                                  borderRadius:
                                                      BorderRadius.circular(5),
                                                  color: HexColor.fromHex(
                                                      '#f8f8f8'),
                                                ),
                                                width: 35,
                                                height: 28,
                                                child: Text(
                                                  '${goodInfo.count}',
                                                  style: TextStyle(
                                                      fontSize: 13,
                                                      fontWeight:
                                                          FontWeight.bold),
                                                  textAlign: TextAlign.center,
                                                ),
                                              ),
                                              SizedBox(
                                                width: 3,
                                              ),
                                              InkWell(
                                                child: Container(
                                                  alignment: Alignment.center,
                                                  decoration: BoxDecoration(
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            5),
                                                    color: HexColor.fromHex(
                                                        '#f8f8f8'),
                                                  ),
                                                  width: 30,
                                                  height: 28,
                                                  child: Text(
                                                    '+',
                                                    style: TextStyle(
                                                        fontSize: 13,
                                                        fontWeight:
                                                            FontWeight.bold),
                                                    textAlign: TextAlign.center,
                                                  ),
                                                ),
                                                onTap: () {
                                                  goodInfo.count++;
                                                  shopCart.refreshView();
                                                },
                                              ),
                                              SizedBox(
                                                width: 10,
                                              )
                                            ],
                                          )
                                        ],
                                      )),
                                    ],
                                  ),
                                ),
                                onDismissed: (direction) {
                                  setState(() {
                                    shopCart.carts.removeAt(index);
                                  });
                                  shopCart.refreshView();
                                },
                              );
                            },
                            separatorBuilder: (context, index) {
                              return Divider(
                                height: 1,
                              );
                            },
                          ),
                        ),
                        Container(
                          decoration: BoxDecoration(
                              border: Border(
                                  top: BorderSide(
                                      color: HexColor.fromHex('#f8f8f8'),
                                      width: 1))),
                          height: 55,
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              InkWell(
                                child: Row(
                                  children: [
                                    SizedBox(
                                      width: 10,
                                    ),
                                    Icon(shopCart.allSelect
                                        ? Icons.check_circle_outline
                                        : Icons.circle_outlined),
                                    SizedBox(
                                      width: 3,
                                    ),
                                    Text('全选')
                                  ],
                                ),
                                onTap: () {
                                  for (var element in shopCart.carts) {
                                    element.checked = !shopCart.allSelect;
                                  }

                                  shopCart.refreshView();
                                },
                              ),
                              Row(
                                children: [
                                  Text('合计：'),
                                  Text(
                                    '¥${shopCart.total}',
                                    style: TextStyle(
                                        color: HexColor.fromHex('#C00000')),
                                  )
                                ],
                              ),
                              SizedBox(
                                width: 100,
                                height: 55,
                                child: TextButton(
                                  style: ButtonStyle(
                                      shape: WidgetStatePropertyAll(
                                          RoundedRectangleBorder(
                                              borderRadius: BorderRadius.zero)),
                                      backgroundColor: WidgetStateProperty.all(
                                          HexColor.fromHex('#C00000'))),
                                  onPressed: () {},
                                  child: Text(
                                    '结算',
                                    style: TextStyle(color: Colors.white),
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                )
              ],
            ),
          ]);
        }),
      ),
    );
  }
}
